<!-- HTML5文件 -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
		<title>微信绑定登陆页</title>
		<link rel="stylesheet" href="assets/agile/css/agile.layout.css">
		<link rel="stylesheet" href="assets/agile/css/flat/flat.component.css">
		<link rel="stylesheet" href="assets/agile/css/flat/flat.color.css">
		<link rel="stylesheet" href="assets/agile/css/flat/iconline.css">
		<link rel="stylesheet" href="assets/agile/css/flat/iconform.css">
		<link rel="stylesheet" href="assets/component/timepicker/timepicker.css">
		<link rel="stylesheet" href="assets/app/css/app.css">
		<link rel="stylesheet" href="assets/my/common/style.css" />
		<link rel="stylesheet" href="assets/agile/css/ratchet/css/ratchet.min.css">
	</head>
	<body>
		<div id="section_container">
			<section id="form_section" data-role="section" class="active">
				<header>
					<div class="titlebar">
						<h1 class="title">查询</h1>
					</div>
				</header>
				<article data-role="article" id="message_article" data-scroll="pull" style="top:44px;bottom:56px;">
					<div class="scroller">
						<ul class="listitem">
							 <script id="template" type="text/html">
							 <% for (i = 0; i < ObjectList.length; i ++) { %>
							 <li class="ring_list-padding" style="padding-left:40px">
						      	<div class="text ring_list-padding">
						      		<br/>
						      		<font>卡号:</font><font style="padding-left:5px;"><%=ObjectList[i].CustomerCode %>(<%= ObjectList[i].MarketID %>)</font>
						      		<br/><br/>
						      		<font>时间:</font><font style="padding-left:5px;"><%=ObjectList[i].Datetime %></font>
						      		<br/><br/>
						      		<font><%=ObjectList[i].MsgType %>:</font><font style="padding-left:5px;">￥<%=ObjectList[i].JE %></font>
						      		<br/><br/>
						      		<font>业务类型:</font><font style="padding-left:5px;"><%=ObjectList[i].YWLX %></font>
						      		<br/><br/>
						      	</div>
						      	</a>
							 </li>
							 <% } %>
							 </script>
						</ul>
					</div>
				</article>
				
				<!--主页显示九宫格列表内容-->		
				<article data-role="article" id="serch_article" data-scroll="verticle" class="active" style="top:44px;bottom:56px;">
					<div class="scroller">
						<div class="grid" data-col="3">
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#3498db;">
									<span class="iconfont iconline-mail"></span>
								</div>
								<label class="grid-label">信息</label>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#F39C12;">
									<span class="iconfont iconline-notebook"></span>
								</div>
								<label class="grid-label">通讯录</label>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#1abc9c;">
									<span class="iconfont iconline-file"></span>
								</div>
								<label class="grid-label">审批</label>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#e74c3c;">
									<span class="iconfont iconline-map-location"></span>
								</div>
								<label class="grid-label">定位</label>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#f1c40f;">
									<div class="iconfont iconline-folder"></div>
								</div>
								<label class="grid-label">文档</label>
							</div>
							<div class="grid-cell">
								<a href="#trade_list" data-toggle="html">
								<div class="grid-img" style="background-color:#449D44;">
									<div class="iconfont iconline-chart-bar"></div>
								</div>
								<label class="grid-label">资金变动</label>
								</a>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#8e44ad;">
									<div class="iconfont iconline-diamond"></div>
								</div>
								<label class="grid-label">交易查询</label>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#FF0000;">
									<div class="iconfont iconline-money-dollar"></div>
								</div>
								<label class="grid-label">资金</label>
							</div>
							<div class="grid-cell">
								<div class="grid-img" style="background-color:#2980B9;">
									<span class="iconfont iconline-chart-pie"></span>
								</div>
								<label class="grid-label">数据分析</label>
							</div>
							<div class="clearfix"></div>
						</div>
					</div>
				</article>
				
				<!-- 我的article -->
				<article data-role="article" id="my_article" data-scroll="verticle" style="top:44px;bottom:56px;">
					<div class="scroller">
						<ul class="table-view">
							<li class="table-view-cell table-view-divider">个人</li>
						  	<li class="table-view-cell media">
						    	<a href="#" data-toggle="html" class="navigate-right">						      		
						        	<span class="badge bg-pomegranate white">HOT</span>
						        	推送设置
						    	</a>
						  	</li>
						  	<li class="table-view-cell media">
						    	<a href="#change_password" data-toggle="html" class="navigate-right">      		
						        	更改密码
						    	</a>
						  	</li>
						  	<li class="table-view-cell media">
						    	<a href="#change_phone" data-toggle="html" class="navigate-right">      		
						        	修改绑定手机
						    	</a>
						  	</li>
						  	<li class="table-view-cell media">
						    	<a href="#" class="navigate-right" id="loginOut">      		
						        	注销登录
						    	</a>
						  	</li>
						  	
						  	<li class="table-view-cell table-view-divider">交易卡</li>
						  	<li class="table-view-cell media">
						    	<a href="#card_list" data-toggle="html" class="navigate-right">						      		
						        	<span class="badge bg-pomegranate white">HOT</span>
						        	我的交易卡
						    	</a>
						  	</li>
						  	
						  	<li class="table-view-cell table-view-divider">关于</li>
						  	<li class="table-view-cell media">
						    	<a href="#" data-toggle="html" class="navigate-right">						      		
						        	开发介绍
						    	</a>
						  	</li>
						  	<li class="table-view-cell media">
						    	<a href="#about" data-toggle="html" class="navigate-right">     		
						        	关于
						    	</a>
						  	</li>
						 </ul>
					</div>
				</article>
				
				
				<footer>
					<nav class="menubar">
						<a class="menu" data-role="tab" href="#message_article" data-toggle="article">
							<span class="menu-icon iconfont iconline-mail"></span>
						    <span class="menu-text">信息</span>
						</a>
						<a class="menu active" data-role="tab" href="#serch_article" data-toggle="article">
							<span class="menu-icon iconfont iconline-search"></span>
						    <span class="menu-text">查询</span>
						</a>
						<a class="menu" data-role="tab" href="#my_article" data-toggle="article">
							<span class="menu-icon iconfont iconline-uid"></span>
						    <span class="menu-text">我的</span>
						</a>
					</nav>
				</footer>
			</section>
		</div>

		<!--- third --->
		<script src="assets/third/jquery/jquery-2.1.3.min.js"></script>
		<script src="assets/third/jquery/jquery.mobile.custom.min.js"></script>
		<script src="assets/third/iscroll/iscroll-probe.js"></script>
		<script src="assets/third/arttemplate/template-native.js"></script>
		<!-- agile -->
		<script type="text/javascript" src="assets/agile/js/agile.js"></script>
		<!--- bridge --->
		<script type="text/javascript" src="assets/bridge/exmobi.js"></script>
		<script type="text/javascript" src="assets/bridge/agile.exmobi.js"></script>
		<!-- app -->
		<script src="assets/component/timepicker/agile.timepicker.js"></script>
		<script type="text/javascript" src="assets/component/extend.js"></script>
		<script type="text/javascript" src="assets/app/js/app.js"></script>
		<!-- my -->
		<script type="text/javascript" src="assets/my/common/my.js"></script>
		<script>
		if(! getCookie("UserID")>0){//进行登陆判断,是否有相应的cookie
			A.alert('错误','请先进行登陆操作',function(){
			    //A.Controller.html("login.html"); 
			});
		}
		
		//底部第一个信息标签,当完全打开时,执行的函数
		$('#message_article').on('articleshow', function(){//监听打开事件
			$("h1.title").text("信息");
			var _url=encodeURIComponent("http://182.92.241.133:8001/API/FrontBackInf/GetNewMsgList?msgID=0&pageSize=50&userID="+getCookie("UserID"));
			myAjax(_url,messageOK);//进行跨域请求json
		});
		function messageOK(json){
			for(i=0;i<json.ObjectList.length;i++){
				var obj= JSON.parse(json.ObjectList[i].Content);
				json.ObjectList[i]["CustomerCode"] = obj.CustomerCode;
				json.ObjectList[i]["Datetime"] = obj.Datetime;
				json.ObjectList[i]["YWLX"] = obj.YWLX;
				json.ObjectList[i]["JE"] = obj.JE;
			}
			if(json.ObjectList.length>0){
				setCookie('MsgID',json.ObjectList[0].MsgID,0);
			}
			A.template('#template').renderReplace(json);
		}
		//当refresh初始化会进入此监听
		$('#message_article').on('refreshInit', function(){
			var refresh = A.Refresh(this);
			//监听下拉刷新事件，可以做一些逻辑操作，当data-scroll="pullup"时无效
			refresh.on('pulldown', function(){
				var _msgID= getCookie("MsgID")>0?getCookie("MsgID"):0;
				var _url=encodeURIComponent("http://182.92.241.133:8001/API/FrontBackInf/GetNewMsgList?msgID="+_msgID+"&pageSize=10&userID="+getCookie("UserID"));
				myAjax(_url,addbefor);//进行跨域请求json
				refresh.refresh();//当scroll区域有dom结构变化需刷新
			});
			//监听上拉刷新事件，可以做一些逻辑操作，当data-scroll="pulldown"时无效
			refresh.on('pullup', function(){
				refresh.refresh();//当scroll区域有dom结构变化需刷新
			});
		});
		function addbefor(json){
			for(i=0;i<json.ObjectList.length;i++){
				var obj= JSON.parse(json.ObjectList[i].Content);
				json.ObjectList[i]["CustomerCode"] = obj.CustomerCode;
				json.ObjectList[i]["Datetime"] = obj.Datetime;
				json.ObjectList[i]["YWLX"] = obj.YWLX;
				json.ObjectList[i]["JE"] = obj.JE;
			}
			A.template('#template').renderBefore(json);
			if(json.ObjectList.length>0){
				setCookie('MsgID',json.ObjectList[0].MsgID,0);
			}else{
				A.showToast('无最新数据');
			}
		}
		
		
		
		$('#serch_article').on('articleshow', function(){//监听打开事件
			$("h1.title").text("查询");
		});
		$('#my_article').on('articleshow', function(){//监听打开事件
			$("h1.title").text("我的");
		});
		
		
		
		
		
		//我的-注销登录 操作
		$('#loginOut').on(A.options.clickEvent,function(){
			delCookie("UserID");
			delCookie("MsgID");
			A.alert('成功','已退出登录,将返回登录页',function(){
			    A.Controller.html("login.html"); 
			});
			return false;
		});
		</script>
	</body>
</html>